<template>
	<view class="user-page" v-model="user">
    <tab-bar></tab-bar>
		<view class="user-head">
			<view class='user-back'>
				<view class="user-auth">
					<view v-if="!isLogin" class="col-f">还未登录哟，请先登录后查看~~</view>
					<view v-if="isLogin">
						<image v-if="user.isPassSkill" class="chooie-img" src="@/static/image/user-good.png"></image>
						<text v-if="user.isPassSkill" class="col-f">技能认证</text>
						<image v-if="!user.isPassSkill" class="chooie-img" src="@/static/image/user-bad.png"></image>
						<text v-if="!user.isPassSkill" class="col-f-60">技能认证</text>
					</view>
					<view v-if="isLogin">
						<image v-if="user.isPassIdentity" class="chooie-img" src="@/static/image/user-good.png"></image>
						<text v-if="user.isPassIdentity" class="col-f">身份认证</text>
						<image v-if="!user.isPassIdentity" class="chooie-img" src="@/static/image/user-bad.png"></image>
						<text v-if="!user.isPassIdentity" class="col-f-60">身份认证</text>
					</view>
					<view v-if="isLogin">
						<image v-if="user.isPassFinance" class="chooie-img" src="@/static/image/user-good.png"></image>
						<text v-if="user.isPassFinance" class="col-f">财务认证</text>
						<image v-if="!user.isPassFinance" class="chooie-img" src="@/static/image/user-bad.png"></image>
						<text v-if="!user.isPassFinance" class="col-f-60">财务认证</text>
					</view>
				</view>
			</view>
			<view class="user-info" >
				<image class="img" :src="user.headImg"  alt="">
					<view class="txt">
						<view v-if="isLogin">
							<text class="user-name fs-36 col-3 fw-bold">{{user.name||"我的昵称"}}</text>
							<text class="user-area col-f fw-bold">{{user.nationality||"中国大陆"}}</text>
              	<!-- <text class="user-name fs-36 col-3 fw-bold">{{"我的昵称我的昵称我的昵称"}}</text>
							<text class="user-area col-f fw-bold">{{"中国大陆中国大陆"}}</text> -->
						</view>
						<view v-if="!isLogin" @click="goToLogin">
							<text class="user-name fs-36 col-3 fw-bold">登录</text>
						</view>
						<view class="lineProgress">
							<u-line-progress active-color="#19b1b8" :height="8" :percent="isLogin?percent:0" :show-percent="false"></u-line-progress>
							<text class="fs-24 col-3">{{isLogin?percent+'%':''}}</text>
						</view>
						<view class="user-xia-year">
							<view>
								<text class="fs-24 col-6 txt-le">侠义值</text>
								<text class="fs-28 col-3 fw-bold">{{isLogin?(user.yxTotalScore ? parseInt(user.yxTotalScore) : '0'):'--'}}</text>
							</view>
							<view>
								<text class="fs-24 col-6 txt-le">翻译年限</text>
								<text class="fs-28 col-3 fw-bold">{{isLogin?(user.year?user.year:'0'):'--'}}</text>
							</view>
						</view>
					</view>
			</view>
		</view>
		<navigator :url="isLogin?'/pages/user/payCenter/index':'/pages/login/index'" class="pay user-con">
			<view class="skill">
				<view class="fs-32 col-3">结算中心</view>
				<view class="fs-24 col-6">
					<image class="right-img" src="@/static/image/right.png"></image>
				</view>
			</view>
      <payContent :payData="payData" :isLogin="isLogin"></payContent>
		</navigator>
		<navigator :url="isLogin?'/pages/user/skill/index':'/pages/login/index'" class="skill user-con" hover-class="navigator-hover">
			<view class="fs-32 col-3">技能信息</view>
			<view class="fs-24 col-6">
				{{(isLogin&&skillNum)?skillNum+'项技能':''}}
				<image class="right-img" src="@/static/image/right.png"></image>
			</view>
		</navigator>
		<view v-if="isLogin" @click="open" class="logout user-con fs-28 col-3">
			退出登录
		</view>
		<u-modal 
    v-model="show" 
    @confirm="confirm" 
    :title="title" 
    :content="content" 
    :show-cancel-button="true" 
    :confirm-style="{fontSize:'36rpx',color:'#19b1b8'}" 
    :cancel-style="{fontSize:'36rpx',color:'#333',borderRight: '1px solid #eee'}"
    :title-style="{
        fontSize: '36rpx',
        color: '#333!important',
        fontWeight: '400',
      }"
     :content-style="{
        fontsize: '30rpx',
        color: '#666',
        lineHeight: '48rpx',
        textAlign: 'left!important',
        padding: '24rpx 48rpx 36rpx 48rpx',
    }"
    ></u-modal>
		<u-toast ref="uToast" />
  </view>

</template>

<script>
import {
  getUserInfo,
  getUserAllInfo,
  getSkill,
  getDeskSkill,
  getAccountAmount,
} from "@/api/user";
import { getStorageExpire } from "@/plugins/utils";
import payContent from "./components/payContent";
import { baseURL } from "@/config/api-config";
export default {
  components: {
    payContent,
  },
  data() {
    return {
      user: {
        name: "",
        headImg: "../../static/image/head-img.png",
        nationality: "", //国籍
        year: "", //翻译年限
        yxTotalScore: "", // 侠义值
        isPassSkill: false, // 技能认证
        isPassIdentity: false, // 身份认证
        isPassFinance: false, // 财务认证
      }, //用户信息
      percent: 0, // 进度值
      isLogin: false, //登录状态
      show: false, // 弹框
      title: "确认退出？",
      content: "退出登录后，将无法查看任务，需要重新登录才能查看哦！", //弹框内容
      skillNum: 0, //技能数量
      payData: {
        totalRev: 0, // 总收入
        balance: 0, // 余额
        withdrawable: 0, // 可提现
      },
    };
  },

  methods: {
    // 登录
    goToLogin() {
      uni.navigateTo({
        url: "pages/login/index",
      });
    },
    // 退出登录
    open() {
      this.show = true;
    },
    confirm() {
      // console.log("确认退出");
      this.$setStorageExpire("access_token", "");
      uni.reLaunch({
        url: "/pages/home/index",
      });
      this.show = false;
      this.isLogin = false;
    },
    // 获取桌面排版技能信息
    getDeskSkill() {
      getDeskSkill().then((res) => {
        if (res.message === "success") {
          if (res.data) this.skillNum++;
        } else {
          this.$refs.uToast.show({
            title: res.message,
            type: "error",
          });
        }
      });
    },
    // 获取技能信息
    getSkill() {
      getSkill().then((res) => {
        if (res.message === "success") {
          let data = res.data;
          if (data.length) {
            this.getDeskSkill();
            for (let i = 0; i < data.length; i++) {
              let item = data[i].cuLevelList;
              if (item && item.length === 2 && item[1].examState === "已通过") {
                this.skillNum++;
              }
            }
          }
        } else {
          this.$refs.uToast.show({
            title: res.message,
            type: "error",
          });
        }
      });
    },
    // 获取用户信息
    getUserInfo() {
      this.$store.dispatch("getUser");
      getUserInfo().then((res) => {
        if (res.message === "success") {
          //用户名
          this.user.name = res.data.nickName;
          //获取账户金额
          this.getAccountAmount(res.data.userCode);
          //头像
          // if (res.data.picturePath) this.user.headImg = res.data.picturePath;
          if (res.data.picturePath)
            this.user.headImg =
              baseURL +
              "/" +
              res.data.picturePath.split("/").slice(3).join("/");
          //国籍
          let addre = res.data.userExtension.nationality;
          this.user.nationality = addre.split(" ")[1]
            ? addre.split(" ")[1]
            : addre.split(" ")[0];
          // 翻译年限
          this.user.year = res.data.userExtension.translateYear;
          // 侠义值
          this.user.yxTotalScore = res.data.yxTotalScore;
          // 认证情况
          const data = res.data;
          if (data.userExtension) {
            this.user.isPassIdentity = data.userExtension.certificatePassed
              ? true
              : false;
            this.user.isPassFinance = data.userExtension.settleCertificatePassed
              ? true
              : false;
          }
          if (data.userExtendList || data.newSkillAuditList) {
            for (let i = 0, len = data.userExtendList.length; i < len; i++) {
              let item = data.userExtendList[i];
              if (item.levelId && item.levelId !== "0") {
                this.user.isPassSkill = true;
                break;
              }
            }
            for (let i = 0, len = data.newSkillAuditList.length; i < len; i++) {
              let item = data.newSkillAuditList[i];
              if (item.auditStatus === "通过") {
                this.user.isPassSkill = true;
                break;
              }
            }
          } else {
            this.$refs.uToast.show({
              title: res.message,
              type: "error",
            });
          }
        }
      });
    },
    // 获取信息完整度
    getUserAllInfo() {
      getUserAllInfo().then((res) => {
        if (res.message === "success") {
          this.percent = parseInt(res.data.toFixed(0));
        } else {
          this.$refs.uToast.show({
            title: res.message,
            type: "error",
          });
        }
      });
    },
    // 获取账户金额
    getAccountAmount(userCode) {
      // console.log("111");
      // let userCode = this.$store.state.userData["userCode"];
      getAccountAmount(userCode).then((res) => {
        // console.log("222");
        if (res.message === "success") {
          // console.log("333");
          const data = res.data;
          if (data.cNY_Balance) {
            this.payData.totalRev = "￥" + data.cNY_TotalIncome;
            this.payData.balance = "￥" + data.cNY_Balance;
            this.payData.withdrawable = "￥" + data.cNY_Withdrawable;
            // console.log("444", userCode,this.$store.state.userData["nickName"], this.payData);
            return;
          } else if (data.uSD_Balance) {
            this.payData.totalRev = "$" + data.uSD_TotalIncome;
            this.payData.balance = "$" + data.uSD_Balance;
            this.payData.withdrawable = "$" + data.uSD_Withdrawable;
            return;
          } else if (data.eUR_Balance) {
            this.payData.totalRev = "€" + data.eUR_TotalIncome;
            this.payData.balance = "€" + data.eUR_Balance;
            this.payData.withdrawable = "€" + data.eUR_Withdrawable;
            return;
          } else if (data.gBP_Balance) {
            this.payData.totalRev = "￡" + data.gBP_TotalIncome;
            this.payData.balance = "￡" + data.gBP_Balance;
            this.payData.withdrawable = "￡" + data.gBP_Withdrawable;
          }
        } else {
          this.$refs.uToast.show({
            title: res.message,
            type: "error",
          });
        }
      });
    },
  },
  onShow() {
    // 判断登录
    if (this.$isLogin()) {
      this.isLogin = true;
      this.skillNum = 0;
      this.getUserInfo();
      this.getUserAllInfo();
      // 获取技能数量
      this.getSkill();
    }
  },
};
</script>

<style>
</style>
